<template>
	<div id="friend-merchant-manage" class="w-h-100 pos-r flex-1 apply-container" style="box-sizing: border-box; overflow: hidden">
		<div class="w-h-100 ver-flex pos-a" style="box-sizing: border-box; padding: 6px">
			<div class="search-s page-public-s" style="box-sizing: border-box">
				<el-card shadow="never" :body-style="{ paddingBottom: '0' }">
					<el-form class="box-f" ref="queryForm" :inline="true">
						<!-- <el-form-item label="危化品名称：">
							<el-input v-model="transferVal" placeholder="请输入危化品名称" />
						</el-form-item> -->

						<el-form-item>
							<el-button v-if="$hasPer('BasicInformation1:add')" @click="nodeClick" icon="ele-Plus" type="primary"> 新增 </el-button>
							<el-button v-if="$hasPer('BasicInformation7:excel')" @click="handleExport" icon="ele-Download"> 导出数据 </el-button>
						</el-form-item>
					</el-form>
				</el-card>
			</div>

			<div style="box-sizing: border-box" class="flex-1 pos-r">
				<div class="pos-a w-h-100" style="box-sizing: border-box">
					<el-card class="box-card w-h-100" shadow="never" style="margin-top: 16px">
						<div style="" class="w-h-100 ver-flex">
							<div class="flex-1 pos-r">
								<div class="pos-a w-h-100">
									<el-table ref="excelRef" :data="list" class="w-h-100" style="width: 100%" border v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.5)">
										<el-table-column type="index" label="序号" width="55" :show-overflow-tooltip="true" align="center" :index="indexMethod" />
										<!-- <el-table-column min-width="120" :show-overflow-tooltip="true" label="友商名称" align="center">
											<el-table-column min-width="120" :show-overflow-tooltip="true" align="center">
												<template #header>
													<SearchModel type-id="v_ProvideName" type-val="input" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
												</template>
												<template #default="{ row }">
													{{ row.v_ProvideName }}
												</template>
											</el-table-column>
										</el-table-column> -->
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="name" label="危化品名称" align="center">
											<el-table-column min-width="120" :show-overflow-tooltip="true" align="center">
												<template #header>
													<SearchModel type-id="name" type-val="input" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
												</template>
												<template #default="{ row }">
													{{ row.name }}
												</template>
											</el-table-column>
										</el-table-column>
										<el-table-column min-width="100" :show-overflow-tooltip="true" prop="unit" label="计量单位" align="center" />
										<el-table-column min-width="160" :show-overflow-tooltip="true" prop="regions" label="可存放区域" align="center">
											<template #default="{ row }">
												<span v-for="item in row.regions" :key="item.regionId">{{ item.regionName }} ，</span>
											</template>
										</el-table-column>
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="createdTime" label=" 创建时间" align="center" />
										<el-table-column min-width="100" :show-overflow-tooltip="true" prop="createdUserName" label="创建人" align="center" />
										<el-table-column min-width="120" :show-overflow-tooltip="true" label="更新时间" align="center">
											<template #default="scope">
												<span v-if="scope.row.updatedTime">{{ scope.row.updatedTime }}</span>
												<span v-else> - </span>
											</template>
										</el-table-column>
										<el-table-column min-width="100" :show-overflow-tooltip="true" label="更新人" align="center">
											<template #default="scope">
												<span v-if="scope.row.updatedUserName">{{ scope.row.updatedUserName }}</span>
												<span v-else> - </span>
											</template>
										</el-table-column>

										<el-table-column min-width="180" label="操作" align="center" fixed="right">
											<el-table-column min-width="180" align="center" fixed="right">
												<template #header>
													<el-button @click="searchClick" icon="ele-Search" type="primary" text> 查询 </el-button>
													<el-button @click="resetClick" icon="ele-Refresh" text> 重置 </el-button>
												</template>
												<template #default="scope">
													<div class="operate-s">
														<el-button @click="queryClick(scope.row)" class="icon-e" icon="ele-View" size="small" text type="success"> 详情 </el-button>
														<el-button v-if="$hasPer('BasicInformation2:edit')" @click="nodeClick(scope.row)" class="icon-e" icon="ele-Edit" size="small" text type="primary"> 编辑 </el-button>
														<el-button v-if="$hasPer('BasicInformation3:file')" size="small" @click="documentClick(scope.row)" text type="primary"> 附件管理 </el-button>
														<el-button v-if="$hasPer('BasicInformation4:delete')" @click="deleteHandle(scope.row.n_Id, getData)" class="icon-e" icon="ele-Delete" size="small" text type="danger">
															删除
														</el-button>
													</div>
												</template>
											</el-table-column>
										</el-table-column>
									</el-table>
								</div>
							</div>
							<div style="height: 30px; margin-top: 20px" class="hr-flex-start">
								<el-pagination
									v-model:currentPage="pageNo"
									v-model:page-size="pageSize"
									:total="totalRows"
									:page-sizes="[10, 20, 50, 100]"
									small
									background
									@size-change="handleSizeChange"
									@current-change="handleCurrentChange"
									layout="total, sizes, prev, pager, next, jumper"
									class="w-h-100"
								/>
							</div>
						</div>
					</el-card>
				</div>
			</div>
		</div>
		<!-- 新增and编辑 -->
		<el-dialog draggable :close-on-click-modal="false" :close-on-press-escape="false" v-model="showDialogVisible" :title="saveId ? '编辑' : '新增'" width="50%" @close="cancelUseClick">
			<el-form label-width="120px" ref="ruleFormRef" :model="ruleForm" size="default" :rules="rules">
				<el-divider content-position="left"> 基本信息 </el-divider>
				<el-row :gutter="35">
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="productName" label="产品名称">
							<el-input v-model="ruleForm.productName" placeholder="请输入产品名称" clearable />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="unit" label="计量单位">
							<el-select v-model="ruleForm.unit" placeholder="请选择计量单位" style="width: 100%">
								<el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value" />
							</el-select>
						</el-form-item>
					</el-col>
					<!-- <el-col v-if="!saveId" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item prop="productId" label="危化品">
                            <el-select v-model="ruleForm.productIdName" placeholder="请选择危化品" style="width: 100%"
                                @change="productChange">
                                <el-option v-for="item in options1" :key="item.value" :label="item.label"
                                    :value="item.value" />
                            </el-select>
                        </el-form-item>
                    </el-col> -->
					<!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item prop="name" label="危化品名称">
                            <el-input v-model="ruleForm.name" placeholder="请输入危化品名称" clearable />
                        </el-form-item>
                    </el-col> -->

					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="listOfRegions" label="可存放区域">
							<!--  show-checkbox check-on-click-node multiple  @check-change="onCheckChange"-->

							<el-tree-select
								v-model="ruleForm.listOfRegions"
								:data="options1"
								@check-change="onCheckChange"
								multiple
								:render-after-expand="false"
								show-checkbox
								check-strictly="true"
								check-on-click-node
								style="width: 100%"
							/>
						</el-form-item>
					</el-col>

					<!-- <el-divider content-position="left"> 附件上传 </el-divider>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> -->
					<!-- <el-form-item prop="listOfRegions" label="附件上传">
                            <el-input v-model="ruleForm.listOfRegions" placeholder="请输入可存放区域" clearable />
                        </el-form-item> -->
					<!-- <el-upload action="#" ref="refFile" list-type="picture-card" :auto-upload="false"
                            :accept="accept" :on-change="handleChange" multiple class="upload-s">
                            <el-icon>
                                <Plus />
                            </el-icon>

                            <template #file="{ file }">

                                <template
                                    v-if="file.name.split('.')[1] === 'jpeg' || file.name.split('.')[1] === 'jpg' || file.name.split('.')[1] === 'png'">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                                </template>

                                <template v-else>
                                    <span class="file-s">{{ file.name }}</span>
                                </template>

                                <span class="el-upload-list__item-actions set-bg"
                                    style="background-color: rgba(0,0,0,.5)!important;">
                                    <span class="el-upload-list__item-delete" @click="handleRemove(file)"
                                        style="background: rgba(0,0,0,0)!important;">
                                        <el-icon>
                                            <Delete />
                                        </el-icon>
                                    </span>
                                </span>

                            </template>
                        </el-upload> -->
					<!-- </el-col> -->
				</el-row>
			</el-form>

			<template #footer>
				<span class="dialog-footer">
					<el-button @click="cancelUseClick">取消</el-button>
					<el-button type="primary" @click="controlUseClick(ruleFormRef, getData)">确定</el-button>
				</span>
			</template>
		</el-dialog>
		<!-- 详情 -->
		<el-dialog draggable :close-on-click-modal="false" :close-on-press-escape="false" v-model="dialogVisible" title="详情" width="50%" @close="dialogVisible = false">
			<el-divider content-position="left"> 基本信息 </el-divider>
			<el-descriptions class="margin-top" :column="2" border>
				<el-descriptions-item>
					<template #label>
						<div class="cell-item">id</div>
					</template>
					{{ descriptionsData.n_Id }}
				</el-descriptions-item>
				<el-descriptions-item>
					<template #label>
						<div class="cell-item">危化品名称</div>
					</template>
					{{ descriptionsData.name }}
				</el-descriptions-item>
				<el-descriptions-item>
					<template #label>
						<div class="cell-item">计量单位</div>
					</template>
					{{ descriptionsData.unit }}
				</el-descriptions-item>
				<!-- <el-descriptions-item>
					<template #label>
						<div class="cell-item">友商名称</div>
					</template>
					{{ descriptionsData.v_ProvideName }}
				</el-descriptions-item> -->

				<el-descriptions-item>
					<template #label>
						<div class="cell-item">可存放区域</div>
					</template>
					{{ descriptionsData.newRegions }}
				</el-descriptions-item>

				<el-descriptions-item>
					<template #label>
						<div class="cell-item">创建人</div>
					</template>
					{{ descriptionsData.createdUserName }}
				</el-descriptions-item>
				<el-descriptions-item>
					<template #label>
						<div class="cell-item">创建时间</div>
					</template>
					{{ descriptionsData.createdTime }}
				</el-descriptions-item>

				<el-descriptions-item>
					<template #label>
						<div class="cell-item">更新人</div>
					</template>
					{{ descriptionsData.updatedUserName }}
				</el-descriptions-item>
				<el-descriptions-item>
					<template #label>
						<div class="cell-item">更新时间</div>
					</template>
					{{ descriptionsData.updatedTime }}
				</el-descriptions-item>
			</el-descriptions>
			<el-divider content-position="left"> 附件信息 </el-divider>
			<el-table :data="descriptionsData.v_FilePath" border style="width: 100%">
				<el-table-column type="index" label="序号" width="60" align="center" />
				<el-table-column prop="createdUserName" label="创建人" align="center" />
				<el-table-column prop="createdTime" label="创建时间" align="center" />
				<el-table-column label="操作" align="center">
					<template #default="scope">
						<el-button @click="viewClick(scope.row)" class="icon-e" text type="success">预览</el-button>
						<el-button @click="downClick(scope.row)" class="icon-e" text type="warning">下载</el-button>
					</template>
				</el-table-column>
			</el-table>
		</el-dialog>
		<!-- 文件上传下载 -->
		<uploadFile isAccept="" :fileInfo="fileInfo" :isUseDialog="fileDialog" @cancelFileClick="cancelFileClick" @controlFileClick="controlFileClick" @updateData="getData" />
	</div>
</template>

<script lang="ts">
import { defineComponent, ref, onMounted, reactive } from 'vue';
import getTableData from '/@/utils/getTableData';
import { ElMessageBox, ElMessage, FormInstance } from 'element-plus';
import {
	getHazardousChemicalsDetailApi,
	getObtainLocationHazardousChemicalsApi,
	getBasicInfoHazardousChemicalApi,
	deleteBasicInfoHazardousChemicalApi,
	addBasicInfoHazardousChemicalApi,
	updateBasicInfoHazardousChemicalApi,
} from '/@/api/sms/HazardousChemicalsInterface';
// import { getSupplierApi, getSupplierProductApi } from "/@/api/sms/common"
import uploadFile from '/@/views/sms/component/reviseUploadFile.vue';
import { Local } from '/@/utils/storage';
import SearchModel from '/@/views/sms/component/search-model.vue';
import { sysFileInfoPreviewBase64 } from '/@/api/centerControl/pubilc';
import { exportToExcel } from '/@/utils/exportToExcel';
import { sysDictDataList } from '/@/api/centerControl/pubilc';
export default defineComponent({
	name: 'friend-merchant-manage',
	components: {
		SearchModel,
		uploadFile,
	},
	setup() {
		/***** 变量 *****/
		let searchObj: any = reactive({});
		const transferVal = ref(); // 需要查询的值
		const showDialogVisible = ref(false);
		const dialogTitle = ref('新增');
		const ruleForm: any = reactive({
			// name: "",
			unit: '',
			listOfRegions: null,
			// provider_Id: 0,//供应商id
			// provider_IdName: null,//供应商id
			productName: '', //危化品id，关联友商产品列表
		});

		// // token 键定义
		// const accessTokenKey = 'access-token';
		// const refreshAccessTokenKey = `x-${accessTokenKey}`;

		// // 获取 token
		// const getToken = () => {
		// 	return Local.get(accessTokenKey);
		// };
		// const accessToken = Local.get(accessTokenKey);
		// function authenticatedFetch(url, options = {}) {
		// 	const headers = new Headers(options.headers || {});
		// 	headers.set('Authorization', `Bearer ${accessToken}`); // 这里假设是Bearer类型的token

		// 	const fetchOptions = {
		// 		...options,
		// 		headers,
		// 	};

		// 	return fetch(url, fetchOptions)
		// 		.then((response) => {
		// 			if (!response.ok) {
		// 				throw new Error(`Request failed with status: ${response.status}`);
		// 			}
		// 			return response.json();
		// 		})
		// 		.catch((error) => {
		// 			console.error('Authenticated fetch error:', error);
		// 			throw error;
		// 		});
		// }

		const rules = reactive({
			unit: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
			listOfRegions: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
			productName: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
		});

		/***** searchClick 查询按钮 *****/
		const searchClick = () => {
			// searchObj.Name = transferVal.value;
			let newObj = Object.keys(searInfo.value);
			if (newObj.length !== 0) {
				newObj.map((i: any) => {
					searchObj[i] = searInfo.value[i];
				});
			}
		};
		const resetClick = () => {
			// transferVal.value = '';
			searInfo.value = {};
			let newObj = Object.keys(searchObj);
			if (newObj.length !== 0) {
				newObj.map((i: any) => {
					searchObj[i] = '';
					// console.log(i);
				});
			}
			initInfoFun();
		};
		/*** nodeClick 新增/编辑点击事件 */
		// url: '/ProviderProduct/Query', url: '/OMS/Provider/Queryv2',
		const options1: any = ref([]);
		const options2: any = ref([]);
		const saveId = ref();
		const nodeClick = async (obj: any) => {
			console.log(obj);
			if (obj.n_Id) {
				saveId.value = obj.n_Id;
				let item = obj.listOfRegions.split(',');
				let list = Array.from(new Set(item));
				let newList = list.map((item: any) => {
					return Number(item);
				});
				ruleForm.unit = obj.unit;
				ruleForm.listOfRegions = newList;
				ruleForm.productName = obj.name;
			}
			showDialogVisible.value = true;
		};

		/*** cancelUseClick 取消事件 */
		const cancelUseClick = () => {
			showDialogVisible.value = false;
			saveId.value = 0;
			ruleForm.unit = '';
			ruleForm.listOfRegions = null;
			ruleForm.productName = ''; //危化品id，关联友商产品列表
			fileList = [];
			newListOfRegions.value = [];
			ruleFormRef.value.clearValidate();
		};

		const ruleFormRef = ref();
		/*** controlUseClick 提交事件 */
		const controlUseClick = async (formEl: FormInstance | undefined, updateFun: Function) => {
			if (!formEl) return;
			await formEl.validate((valid, fields) => {
				if (valid) {
					ruleForm.listOfRegions = newListOfRegions.value.join(',');
					console.log(ruleForm);
					if (saveId.value) {
						const obj = Object.assign({ ...ruleForm, id: saveId.value });
						updateBasicInfoHazardousChemicalApi(obj).then((res) => {
							cancelUseClick();
							updateFun();
						});
					} else {
						addBasicInfoHazardousChemicalApi(ruleForm).then((res) => {
							cancelUseClick();
							updateFun();
						});
					}
				} else {
					console.log('error submit!', fields);
				}
			});
		};

		/*** deleteHandle 删除数据事件 */
		const deleteHandle = async (val: String | Number, updateFun: Function) => {
			ElMessageBox.confirm('请确定删除此条数据', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning',
			})
				.then(async () => {
					let param = { id: val };
					try {
						let res: any = await deleteBasicInfoHazardousChemicalApi(param);
						if (res.success) {
							updateFun();
						}
					} catch (err) {
						return;
					}
				})
				.catch(() => {
					ElMessage({
						type: 'info',
						message: '删除失败',
					});
				});
		};

		//#region 附件上传
		let refFile = ref();
		let fileList: any = [];
		const formRefUpload = ref();
		/*** handleChange 文件上传改变事件 */
		const handleChange = (file: any) => {
			fileList.push(file);
		};
		/*** 删除文件 */
		const handleRemove = (file: any) => {
			fileList.map((itm: any, inx: number) => {
				if (file.uid === itm.uid) {
					fileList.splice(inx, 1);
				}
			});
			refFile.value.handleRemove(file);
		};
		//#endregion

		//#region 查看详情
		const dialogVisible = ref(false);
		const descriptionsData = ref();

		const queryClick = async (row: any) => {
			descriptionsData.value = null;
			const res = await getHazardousChemicalsDetailApi({ id: row.n_Id });
			descriptionsData.value = res.data;
			let list = descriptionsData.value.regions.map((element: any) => {
				return element.regionName;
			});
			descriptionsData.value['newRegions'] = list.join(',');
			dialogVisible.value = true;
		};
		//#endregion
		const options11: any = ref([]);
		onMounted(async () => {
			const res1 = await sysDictDataList({ TypeCode: 'MeasuringUnit' });
			options2.value = res1.data.map((element: any) => {
				return {
					label: element.value,
					value: element.value,
				};
			});
			const res2 = await getObtainLocationHazardousChemicalsApi();
			options1.value = treeFun(res2.data);
			options11.value = treeFun(res2.data);
		});

		const treeFun = (arr: any) => {
			let newArr = arr.map((element: any) => {
				return {
					label: element.locationName,
					value: element.locationId,
					bl: false,
					children: treeFun(element.children),
				};
			});
			return newArr;
		};

		const newListOfRegions: any = ref([]);
		const onCheckChange = (item) => {
			console.log(item, 'item');
			console.log(newListOfRegions.value.length, 'newListOfRegions.value');
			if (newListOfRegions.value.length) {
				let bl = newListOfRegions.value.some((e) => {
					return e === item.value;
				});
				console.log(bl);
				if (bl) {
					newListOfRegions.value = newListOfRegions.value.filter((e) => e !== item.value);
					console.log(newListOfRegions.value, 'a');
				} else {
					newListOfRegions.value.push(item.value);
					console.log('继续新增');
				}
			} else {
				newListOfRegions.value.push(item.value);
				console.log('首次新增');
			}
		};

		// 附件上传
		/*** 附件管理 */
		const fileInfo = ref();
		const fileDialog = ref(false);
		const cancelFileClick = () => {
			fileDialog.value = false;
		};
		const controlFileClick = () => {
			fileDialog.value = false;
		};
		const documentClick = (val: any) => {
			console.log(val, 'val');
			val.sourceType = 10;
			val.sourceId = val.n_Id;
			val.titleCon = '附件上传';
			fileInfo.value = JSON.stringify(val);
			fileDialog.value = true;
		};

		/*** 初始化数据 */
		const basicsInfo: any = ref([]);
		const initInfoFun = () => {
			basicsInfo.value = [
				{
					typeId: 'name', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
					typeNam: '', // 输入类型(number,text等) --- 选填
					searchVal: 'ProductName', // 查询字段 --- 必填
					defaultVal: '', // 字段默认值 --- 选填
					placeholder: '危化品名称', // placeholder数据
					defaultProp: '', // 下拉框中使用，除下拉框外其它情况为空 --- 选填
					eventType: '', // 事件类型（如burl/change等） --- 选填
					defaultEvent: '', // 事件名称 --- 选填
				},
				// {
				// 	typeId: 'v_ProvideName', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
				// 	typeNam: '', // 输入类型(number,text等) --- 选填
				// 	searchVal: 'ProviderName', // 查询字段 --- 必填
				// 	defaultVal: '', // 字段默认值 --- 选填
				// 	placeholder: '友商名称', // placeholder数据
				// 	defaultProp: '', // 下拉框中使用，除下拉框外其它情况为空 --- 选填
				// 	eventType: '', // 事件类型（如burl/change等） --- 选填
				// 	defaultEvent: '', // 事件名称 --- 选填
				// },
			];
		};

		const searInfo: any = ref();
		const searchHandel = (val: any) => {
			searInfo.value = val;
		};

		onMounted(() => {
			initInfoFun();
		});

		/*** viewClick 文件预览 */
		const baseUrl = import.meta.env.VITE_API_URL;
		const viewClick = async (val: any) => {
			let viewUrl = baseUrl + '/' + val.path;
			window.open(viewUrl);
		};
		/*** downClick 下载文件 */
		const downClick = async (val: any) => {
			let getFile = getFileFun(val.id);
			// 等待getFileFun完成
			await getFile;
			if (getFile && getFile.then) {
				getFile.then((res) => {
					let base64Data = res;
					let blob = base64ToBlob(base64Data);

					// 创建可下载的链接
					let url = URL.createObjectURL(blob);
					let link = document.createElement('a');
					link.href = url;
					link.download = val.fileOriginName; // 指定下载的文件名

					// 将链接添加到DOM中
					document.body.appendChild(link);

					// 触发点击事件开始下载
					link.click();

					// 释放临时URL
					URL.revokeObjectURL(url);
				});
			}
		};
		/*** getFileFun 获取文件数据 */
		const getFileFun = async (val: Number) => {
			let param: any = {};
			param.id = val;
			let res: any = await sysFileInfoPreviewBase64(param);
			console.log(res, 'res');
			if (res.success) {
				return res.data;
			}
		};
		// 将Base64编码数据转换为Blob对象的辅助函数
		const base64ToBlob = (base64Data: any) => {
			var byteString = atob(base64Data.split(',')[1]); // 提取Base64编码的数据部分
			var mimeString = base64Data.split(':')[1].split(';')[0]; // 提取MIME类型
			var ab = new ArrayBuffer(byteString.length);
			var ia = new Uint8Array(ab);
			for (var i = 0; i < byteString.length; i++) {
				ia[i] = byteString.charCodeAt(i);
			}
			return new Blob([ab], { type: mimeString });
		};

		/*** ================================= 导出数据函数操作 ================================= */
		const excelRef: any = ref(null);
		const handleExport = () => {
			if (excelRef.value) {
				if (excelRef.value.data.length !== 0) {
					let tableExcel: any = [];
					let tableArr = excelRef.value.data;
					tableArr.map((item: any) => {
						let tableObj: any = {};
						// tableObj['友商名称'] = item.v_ProvideName ? item.v_ProvideName : '-';
						tableObj['危化品名称'] = item.name ? item.name : '-';
						tableObj['计量单位'] = item.unit ? item.unit : '-';
						tableObj['可存放区域'] = item.regionName ? item.regionName : '-';

						tableObj['创建人'] = item.createdUserName ? item.createdUserName : '-';
						tableObj['创建时间'] = item.createdTime ? item.createdTime : '-';
						tableObj['更新人'] = item.updatedUserName ? item.updatedUserName : '-';
						tableObj['更新时间'] = item.updatedTime ? item.updatedTime : '-';
						tableExcel.push(tableObj);
					});
					exportToExcel(tableExcel, '危化品基础信息.xlsx');
				} else {
					ElMessage({
						type: 'error',
						message: '暂无数据导出',
					});
				}
			}
		};

		return {
			...getTableData(getBasicInfoHazardousChemicalApi, {}, searchObj),
			cancelUseClick,
			controlUseClick,
			nodeClick,
			deleteHandle,
			searchClick,
			transferVal,
			/***/
			showDialogVisible,
			initInfoFun,
			dialogTitle,
			ruleForm,
			options1,
			options2,
			saveId,
			rules,
			// providerChange,
			ruleFormRef,
			handleRemove,
			handleChange,
			formRefUpload,
			fileList,
			refFile,
			queryClick,
			dialogVisible,
			descriptionsData,
			resetClick,
			onCheckChange,
			documentClick,
			controlFileClick,
			cancelFileClick,
			fileDialog,
			fileInfo,
			searchHandel,
			basicsInfo,
			viewClick,
			downClick,
			handleExport,
			excelRef,
		};
	},
});
</script>

<style lang="scss">
@import '../style/public.scss';
</style>

<style scoped lang="scss">
#friend-merchant-manage {
	.box-f {
		:deep(.el-form-item__label) {
			padding: 0;
		}
	}

	:deep(.el-card__body) {
		height: 100%;
	}

	:deep(.el-card) {
		border: none !important;
	}

	.upload-demo {
		margin-left: 12px;
		margin-top: 2px;
	}

	ul {
		list-style: none;

		li {
			cursor: pointer;

			&:hover {
				color: red;
			}
		}
	}

	.icon-e {
		:deep(.el-icon) {
			margin-right: 0px !important;
		}
	}
}
</style>
